<!DOCTYPE html>
<html lang="en">

<!--
  Author：蓝田_Loto
  Date：2018-11-03 14:42
  PageName：a_border_Style.html
  Function：表格CSS样式 - 设置细线表格
  URL：http://localhost:8080/i_table/i5_style_table/a_border_Style.html
-->

<head>
    <meta charset="UTF-8">
    <title>表格CSS样式 - 设置细线表格</title>

    <style type="text/css">
        table {
            border-collapse: collapse;
        }

        /* 合并单元格边框 */
        th, td {
            font-size: 12px;
            border: solid 1px gray;  /* 定义单元格边框显示为1像素的灰色实线 */
        }
    </style>
</head>

<body>
<table>
    <tr>
        <th>属性</th>
        <th>版本</th>
        <th>继承性</th>
        <th>描述</th>
    </tr>

    <tr>
        <td>table-layout</td>
        <td>CSS2</td>
        <td>无</td>
        <td>设置或检索表格的布局算法</td>
    </tr>

    <tr>
        <td>border-collapse</td>
        <td>CSS2</td>
        <td>有</td>
        <td>设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开</td>
    </tr>

    <tr>
        <td>border-spacing</td>
        <td>CSS2</td>
        <td>有</td>
        <td>设置或检索当表格边框独立时，行和单元格的边框在横向和纵向上的间距</td>
    </tr>

    <tr>
        <td>caption-side</td>
        <td>CSS2</td>
        <td>有</td>
        <td>设置或检索表格的caption对象是在表格的那一边</td>
    </tr>

    <tr>
        <td>empty-cells</td>
        <td>CSS2</td>
        <td>有</td>
        <td>设置或检索当表格的单元格无内容时，是否显示该单元格的边框</td>
    </tr>
</table>
</body>
</html>